import { haoMiao, ranDomRange } from '../../common/utils'
// 全局唯一的 App 实例
const rootApp = getApp()
// 背景音频实例
const backgroundAudioManager = wx.getBackgroundAudioManager()
// 存储歌单中所有的信息
let songList = []
// 音乐的地址
let musicLink = ''
// 当前播放歌曲的id
let musicId = ''
// 当前swiper的下标
let beforeSwiper = 0
// swiper滑动前的下标
let currentSwiper = 0
// 当前播放的音乐在songList中的下标
let indexList = 0
// 播放方式    0 顺序  1 循环 2 随机
let ispyInCss = 0

Page({
  data: {
    // 页面标题和作者
    pageTltieIofo: {},
    // 手机状态栏高度
    statusBarHeight: wx.getSystemInfoSync().statusBarHeight,
    // 音乐播放动画
    isPlay: false,
    // 要渲染的swiper-item数组
    swiperItemArr: [],
    //当前所在滑块的 index
    swiperCurrent: 0,
    // 控制收藏图标
    islike: false,
    // 实时时间
    currentTime: '00:00',
    // 总时长
    durationTime: '00:00',
    // 进度条实时宽度
    currentWidth: 0,
    // 播放方式
    playIconClass: 'icon-iconsMusicyemianbofangmoshiRepeat',
  },
  //options(Object)
  onLoad: function (options) {
    console.log(musicId, options.songid, options.songid === musicId)
    // 当前播放歌曲的id
    musicId = options.songid
    // 只保存歌单的（简化数据）{id:音乐id,name:歌名,alName:歌手,imgurl:图片地址}
    this.getSongUrl()
    // 查找当前id的音乐信息
    let datafind = this.getSongListFind(musicId)
    // 获取当前音乐的下标,并保存
    this.getSongListIndex(musicId)

    // 截取往后两首歌
    let swiperItemArr = songList.slice(indexList, indexList + 3)
    // 更新页面信息
    this.setData({
      durationTime: haoMiao(datafind.dt).fenMiao,
      pageTltieIofo: datafind,
      swiperItemArr,
    })

    // 判断之前是否播放过音乐
    if (rootApp.globalDate.isMusicPlay && rootApp.globalDate.globamusicId === musicId) {
      // 更新为播放状态
      this.setisPlay(true)
      // 监听背景音频的播放、暂停、错误信息 ------>系统任务栏
      this.backgroundAudioManager_onPlayonPause()
    } else {
      // 如果是第一次点击进来或者是点击进来的另一首音乐，就重新播放新的音乐
      // 监听背景音频的播放、暂停、错误信息 ------>系统任务栏
      this.backgroundAudioManager_onPlayonPause()
      // 获取音乐地址------ 设置src地址自动播放
      this.getYinyueUrl(musicId, this.data.pageTltieIofo.name)
    }
  },
  //播放、暂停按钮回调
  handleMusicPlay() {
    // 判断音乐播放、暂停
    if (this.data.isPlay) {
      backgroundAudioManager.pause()
    } else {
      // 重新播放音乐
      backgroundAudioManager.play()
    }
  },
  // 按钮切换歌曲回调
  // 原理：切换swiper到下一个或者上一个滑块，自动触发onChange()回调函数，完成切换歌曲
  handleSwitch(e) {
    let { type } = e.currentTarget.dataset
    if (type == 'pre') {
      beforeSwiper = beforeSwiper - 1 == -1 ? 2 : beforeSwiper - 1
    } else {
      beforeSwiper = beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1
    }
    this.setData({
      swiperCurrent: beforeSwiper,
    })
  },
  // swiper 切换回调
  onChange(event) {
    // 先关闭音乐
    backgroundAudioManager.stop()
    // 停止动画
    this.setisPlay(false)
    // 当前滑块的下标
    beforeSwiper = event.detail.current

    // 判断是在向前翻页
    if (currentSwiper - beforeSwiper == 2 || currentSwiper - beforeSwiper == -1) {
      // 数组前一个是不是最后一个
      indexList = indexList + 1 == songList.length ? 0 : indexList + 1
      // 判断是在向后翻页
    } else if (currentSwiper - beforeSwiper == 1 || currentSwiper - beforeSwiper == -2) {
      // 数组下一个是不是最后一个
      indexList = indexList - 1 == -1 ? songList.length - 1 : indexList - 1
    }
    // 保存当前swiper-iten下标
    currentSwiper = beforeSwiper
    // 更新swiperItemArr数组，
    this.setSwiperItemArr()
  },
  // 收藏歌曲点击回调
  async like() {
    let request = await wx.$http.get('/like', { id: musicId, like: !this.data.islike })
    if (request.code === 200) {
      this.setData({
        islike: !this.data.islike,
      })
    }
  },
  // 音乐播放方式
  playicon() {
    let text = ''
    let { playIconClass } = this.data
    ispyInCss = ispyInCss + 1 == 3 ? 0 : ispyInCss + 1
    switch (ispyInCss) {
      case 1:
        playIconClass = 'icon-iconsMusicyemianbofangmoshiAlrepeatOne'
        text = '单曲播放'
        break
      case 2:
        playIconClass = 'icon-iconsMusicyemianbofangmoshiShuffle'
        text = '随机播放'
        break
      default:
        playIconClass = 'icon-iconsMusicyemianbofangmoshiRepeat'
        text = '顺序播放'
    }
    wx.showToast({
      title: text,
      icon: 'none',
      duration: 1000,
      mask: false,
      success: result => {
        this.setData({
          playIconClass,
        })
      },
    })
  },
  //slider组件 完成一次拖动后触发的事件
  async sliderchange(e) {
    // 暂停音乐
    await backgroundAudioManager.pause()

    let eW = e.detail.value
    //  先换算回来得到歌曲时间  秒
    let date = (eW / 100000) * this.data.pageTltieIofo.dt
    this.setData({
      currentTime: haoMiao(date * 1000).fenMiao,
      currentWidth: e.detail.value,
    })
    // 跳转到指定位置  BackgroundAudioManager.seek(number currentTime)
    await backgroundAudioManager.seek(date.toFixed(3) * 1)
    // 延时播放一下
    setTimeout(() => {
      backgroundAudioManager.play()
    }, 200)
  },
  // 切换歌词
  async switchLyrics() {
    let request = await wx.$http.get('/lyric', { id: musicId })
    console.log(request)
  },
  /**
   * ---------------- 下面为处理函数
   */

  // 只保存歌单的（简化数据）{id:音乐id,name:歌名,alName:歌手,imgurl:图片地址}
  getSongUrl() {
    let recommendList = wx.getStorageSync('recommendList')
    // 简化歌单数据
    songList = recommendList.map(item => {
      return { id: item.id, name: item.name, arNmae: item.ar[0].name, imgurl: item.al?.picUrl, dt: item.dt }
    })
  },
  // 获取音乐地址------ 设置src地址自动播放
  async getYinyueUrl(id, title) {
    let result = await wx.$http.get('/song/url', { id })
    musicLink = result.data[0].url
    backgroundAudioManager.title = title
    backgroundAudioManager.src = musicLink
  },
  // 查找当前id的音乐信息
  getSongListFind(id) {
    let idObject = songList.find(item => item.id == id)
    return idObject
  },
  // 监听背景音频的播放、暂停、错误信息、停止 ------>系统任务栏
  backgroundAudioManager_onPlayonPause() {
    /**  不知道为啥开了，就在在进来就出问题
    // 监听背景音频停止
    backgroundAudioManager.stop(() => {
      this.setisPlay(false)
      console.log('监听背景音频停止')
    })
    **/
    //  监听背景音频暂停
    backgroundAudioManager.onPause(() => {
      this.setisPlay(false)
    })
    //  监听背景音频播放
    backgroundAudioManager.onPlay(() => {
      this.setisPlay(true)
      // 保存音乐id到全局变量中
      rootApp.globalDate.globamusicId = musicId
    })
    // 监听背景音频自然播放结束事件
    backgroundAudioManager.onEnded(() => {
      // 先关闭磁盘动画
      this.setisPlay(false)
      switch (ispyInCss) {
        // case 0:
        //   // 切换下一首，原理：切换swiper到下一个滑块，自动触发onChange()回调函数，完成切换歌曲
        //   beforeSwiper = beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1
        //   break
        case 1:
          // 单曲播放  重新请求音乐地址
          this.getYinyueUrl(musicId, this.data.pageTltieIofo.name)
          break
        case 2:
          // 随机播放原理： 还是切换swiper,因为切换swiper会自动更新要渲染的swiper-item数组
          // 只需要确定当前滑块的内容（下标）  前后滑块的数据，swiper切换回调函数会自动更新
          // 递归得到随机下标
          let sj = ranDomRange(0, songList.length - 1)
          // 切换下一首，原理：切换swiper到下一个滑块，自动触发onChange()回调函数，完成切换歌曲
          beforeSwiper = beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1
          // 当前滑块的内容的数据下标
          indexList = sj
          break
        default:
          // 切换下一首，原理：切换swiper到下一个滑块，自动触发onChange()回调函数，完成切换歌曲
          beforeSwiper = beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1
      }
      // 重置数据
      this.setData({
        swiperCurrent: beforeSwiper,
      })
    })
    // 监听背景音频错误信息
    backgroundAudioManager.onError(e => {
      console.log('背景音乐播放错误onError', e)
      beforeSwiper = beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1
      this.setData({
        swiperCurrent: beforeSwiper,
      })
      wx.showToast({
        title: '播放错误,自动切换下一首',
        icon: 'none',
      })
    })
    // 监听背景音频播放进度更新事件，只有小程序在前台时会回调
    backgroundAudioManager.onTimeUpdate(() => {
      let curr = backgroundAudioManager.currentTime
      this.setData({
        currentTime: haoMiao(curr * 1000).fenMiao,
        // 播放时间 / 总时长 得到 百分比  * 100000  得到毫秒
        currentWidth: (curr / this.data.pageTltieIofo.dt) * 100000,
      })
    })
  },
  // 更新播放按钮与动画
  setisPlay(isPlay) {
    this.setData({
      isPlay,
    })
    // 修改全局音频的播放状态
    rootApp.globalDate.isMusicPlay = isPlay
  },
  // 获取当前音乐的下标,并保存
  getSongListIndex(id) {
    let i = songList.findIndex(item => item.id == id)
    indexList = i
  },
  // 更新swiperItemArr数组，
  // 为了网络问题先更新数组在播发新音乐
  setSwiperItemArr() {
    let swiperItemArr = []
    // 先设置当前滑块的数据
    swiperItemArr[beforeSwiper] = songList[indexList]

    //  swiperItemArr[beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1]
    //  判断前一页是不是下一组的第一页
    swiperItemArr[beforeSwiper + 1 == 3 ? 0 : beforeSwiper + 1] = songList[indexList + 1 == songList.length ? 0 : indexList + 1]
    //  swiperItemArr[beforeSwiper - 1 == -1 ? 2 : beforeSwiper - 1]
    //  判断后一页是不是下一组的第三元页
    swiperItemArr[beforeSwiper - 1 == -1 ? 2 : beforeSwiper - 1] = songList[indexList - 1 == -1 ? songList.length - 1 : indexList - 1]
    // 查找当前id的音乐信息
    let datafind = this.getSongListFind(songList[indexList].id)
    this.setData({
      pageTltieIofo: datafind,
      swiperItemArr,
      currentTime: '00:00',
      currentWidth: 0,
      durationTime: haoMiao(datafind.dt).fenMiao,
    })

    // 获取音乐地址------ 设置src地址自动播放
    this.getYinyueUrl(datafind.id, datafind.name)
  },
})
